<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<!-- Content Header (Page header) -->
<section class="content-header" style="">
    <h1>
        业务明细
        <small>业务明细管理页面</small>
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 主页</a></li>
        <li><a href="#">业务管理</a></li>
        <li class="active">业务管理</li>
    </ol>
</section>

<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <!-- /.box-header -->
                <div class="box-body">
                    <div id="toolbar">
                        <form class="form-inline" id="searchForm">
                            <div class="form-group">
                                <label for="searchBeginDate"> 开始日期</label>
                                <input type="text" class="form-control input-sm" name="beginDate" id="searchBeginDate"
                                       placeholder="开始日期">
                            </div>
                            <div class="form-group">
                                <label for="searchEndDate"> 结束日期</label>
                                <input type="text" class="form-control input-sm" name="endDate" id="searchEndDate"
                                       placeholder="结束日期">
                            </div>
                            <div class="form-group">
                                <label for="searchOrganizationNo">单元编码</label>
                                <input type="text" class="form-control input-sm" name="organizationNo"
                                       id="searchOrganizationNo" placeholder="单元编码">
                            </div>
                            <div class="form-group">
                                <label for="searchPhone">手机号码</label>
                                <input type="text" class="form-control input-sm" name="phone" id="searchPhone"
                                       placeholder="请输入客户号码">
                            </div>
                            <div class="form-group">
                                <label for="searchEmployer">员工姓名</label>
                                <input type="text" class="form-control input-sm" name="employer" id="searchEmployer"
                                       placeholder="请输入员工姓名">
                            </div>
                            <div class="btn-group btn-group-sm">
                                <button type="button" class="btn btn-default"
                                        onclick="javascript:$('table').bootstrapTable('refresh', {silent: true});">
                                    <i class="glyphicon glyphicon-search"></i>
                                    查询
                                </button>
                                <button type="reset" class="btn btn-default">
                                    <i class="glyphicon glyphicon-trash"></i>
                                    清空
                                </button>
                            </div>
                        </form>
                        <div class="btn-group btn-group-sm">
                            <!-- Provides extra visual weight and identifies the primary action in a set of buttons -->
                            <button shiro:hasPermission="produce:create" type="button" id="addBtn"
                                    class="btn btn-default"
                                    data-toggle="modal"
                                    data-target="#addModal"><i class="glyphicon glyphicon-plus"></i> 新增
                            </button>
                            <!-- Indicates caution should be taken with this action -->
                            <button shiro:hasPermission="produce:update" type="button" id="editBtn"
                                    class="btn btn-default"
                                    data-toggle="modal"
                                    data-target="#editModal"
                                    data-action="{type:'editable',form:'#editForm',table:'#table',after:'editAfter'}"
                                    disabled><i class="glyphicon glyphicon-edit"></i> 修改
                            </button>
                            <!-- Indicates a dangerous or potentially negative action -->
                            <button shiro:hasPermission="produce:delete" type="button" id="deleteBtn"
                                    class="btn btn-default" data-toggle="modal"
                                    data-target="#deleteModal"
                                    data-action="{type:'delete',form:'#deleteForm',idField:'id',table:'#table'}"
                                    disabled><i class="glyphicon glyphicon-remove"></i> 删除
                            </button>
                            <button shiro:hasPermission="produce:import" type="button" id="importBtn"
                                    class="btn btn-default"
                                    data-toggle="modal"
                                    data-target="#importModal"><i class="glyphicon glyphicon-plus"></i> 导入
                            </button>
                            <button shiro:hasPermission="produce:verify" type="button" id="verifyBtn"
                                                               class="btn btn-default"
                                                               data-toggle="modal"
                                                               data-target="#verifyModal"
                                                               data-action="{type:'verify',form:'#verifyForm',idField:'id',table:'#table'}" disabled><i class="glyphicon glyphicon-plus"></i> 审核
                        </button>
                        </div>
                    </div>
                </div>
                <p th:text="${user}">Some text here...</p>
                <table id="table"></table>
            </div>
            <!-- /.box-body -->
        </div>
        <!-- /.box -->

    </div>
    <!-- /.col -->
    </div>
    <!-- /.row -->
</section>
<!-- /.content -->

<!-- add Modal -->
<div class="modal fade" id="addModal" tabindex="-1" role="dialog" aria-labelledby="addModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="addModalLabel">添加业务明细</h4>
            </div>
            <div class="modal-body">
                <form id="addForm">
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="datepicker"><span
                                    class="asterisk">*</span>日期:</label>
                            <div class="col-sm-4">
                                <div class="input-group date">
                                    <div class="input-group-addon">
                                        <i class="fa fa-calendar"></i>
                                    </div>
                                    <input type="text" class="form-control pull-right" id="datepicker"
                                           name="handleDate">
                                </div>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="handlerChannel"><span
                                    class="asterisk">*</span>办理渠道:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="handlerChannel" name="handlerChannel"
                                       placeholder="门店/微信/营销/七陌"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="phone"><span
                                    class="asterisk">*</span>手机号码:</label>
                            <div class="col-sm-4 control-label">
                                <input type="text" class="form-control" id="phone" name="phone" placeholder="手机号码"
                                       minlength="11">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="phoneSecond"><span
                                    class="asterisk">*</span>副卡号码:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="phoneSecond" name="phoneSecond"
                                       placeholder="副卡号码">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="bizType"><span
                                    class="asterisk">*</span>办理业务:</label>
                            <div class="col-sm-4">
                                <select class="form-control select2" id="bizType" name="bizType">
                                    <!--<option value="0" text="选择属性">选择属性</option>-->
                                    <option th:each="biztype : ${bizTypeMap}" th:value="${biztype.key}" th:text="${biztype.value}">业务不存在</option>
                                </select>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="bizDetail"><span
                                    class="asterisk">*</span>业务明细:</label>
                            <div class="col-sm-4">
                               <!-- <input type="text" class="form-control" id="bizDetail" name="bizDetail"
                                       required>-->
                                <input type="text" class="form-control typeahead" id="bizDetail" name="bizDetail" data-provide="typeahead" placeholder="业务明细" minlength="1">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="specPri"><span
                                    class="asterisk">*</span>原规格产品:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="specPri" name="specPri"
                                       placeholder="E基础业务" required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="specCur"><span
                                    class="asterisk">*</span>新办规格产品:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="specCur" name="specCur"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="sumMoney">金额:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="sumMoney" name="sumMoney" placeholder="金额">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="handlerNo">工号明细:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control typeahead" id="handlerNo" name="handlerNo" data-provide="typeahead" placeholder="工号明细" minlength="1">
                                <!--<input type="text" class="form-control" id="handlerNo"
                                       name="handlerNo" placeholder="新产品">-->
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="organizationName"><span class="asterisk">*</span>门店名称</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="organizationName" name="organizationName"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="handleType"><span
                                    class="asterisk">*</span>办理方式:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="handleType" name="handleType">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="batchNo"><span
                                    class="asterisk">*</span>批次号:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="batchNo" name="batchNo"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="packageNo"><span
                                    class="asterisk">*</span>包编:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="packageNo" name="packageNo">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="donateMonth"><span
                                    class="asterisk">*</span>月赠送金额:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="donateMonth" name="donateMonth"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="organizationNo">单元编码:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="organizationNo" name="organizationNo">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="employer"><span
                                    class="asterisk">*</span>员工姓名:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="employer" name="employer"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="rewardPiecework">计件酬金:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="rewardPiecework" name="rewardPiecework">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="score">移动积分:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="score" name="score"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="partsBalance">配件差价:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="partsBalance" name="partsBalance">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="commission">提成:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="commission" name="commission"
                                       required>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                        <div class="span6">
                            <label class="col-sm-2 control-label" for="remark">备注:</label>
                            <div class="col-sm-4">
                                <input type="text" class="form-control" id="remark" name="remark">
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="submit" form="addForm" class="btn btn-primary"
                        data-action="{type:'submit',form:'#addForm',url:'@{/produce/create}',after:'$.myAction.refreshTable'}">
                    确定
                </button>
            </div>
        </div>
    </div>
</div>
<!-- edit Modal -->
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="editModalLabel">修改明细</h4>
            </div>
            <div class="modal-body">
                <form id="editForm">
                    <input type="hidden" name="id" readonly required>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editdatepicker"><span
                                class="asterisk">*</span>日期:</label>
                        <div class="col-sm-4">
                            <div class="input-group date">
                                <div class="input-group-addon">
                                    <i class="fa fa-calendar"></i>
                                </div>
                                <input type="text" class="form-control pull-right" id="editdatepicker"
                                       name="handleDate">
                            </div>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editmode"><span
                                class="asterisk">*</span>渠道:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editmode" name="mode" placeholder="办理渠道"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editphone"><span class="asterisk">*</span>号码:</label>
                        <div class="col-sm-4 control-label">
                            <input type="text" class="form-control" id="editphone" name="phone" placeholder="手机号码"
                                   minlength="11">
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editphoneSecond"><span
                                class="asterisk">*</span>副号:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editphoneSecond" name="phoneSecond"
                                   placeholder="副卡号码">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="editpackageMain"><span
                                class="asterisk">*</span>主套餐:</label>
                        <div class="col-sm-8  col-md-pull-2">
                            <input type="text" class="form-control" id="editpackageMain" name="packageMain"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <!---->
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editbizType"><span
                                class="asterisk">*</span>办理业务:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editbizType" name="bizType"
                                   placeholder="E基础业务" required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editbizName"><span
                                class="asterisk">*</span>业务明细:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editbizName" name="bizName"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editspecPri">原产品:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editspecPri" name="specPri" placeholder="原规格产品">
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editspecCur">新产品:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editspecCur"
                                   name="specCur" placeholder="新产品">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="edithandleNo"><span
                                class="asterisk">*</span>办理工号</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="edithandleNo" name="handleNo"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="edithandleType"><span
                                class="asterisk">*</span>办理方式:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="edithandleType" name="handleType">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editsumMoney"><span
                                class="asterisk">*</span>金额:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editsumMoney" name="sumMoney"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editorganizationName"><span class="asterisk">*</span>服务站:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editorganizationName" name="organizationName">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editservicer"><span
                                class="asterisk">*</span>服务人员:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editservicer" name="servicer"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editreward">记件酬金:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editreward" name="reward">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editscore"><span
                                class="asterisk">*</span>移动积分:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editscore" name="score"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editincome">配件差价:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editincome" name="income">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="editincomeOther">其他收入:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editincomeOther" name="incomeOther"
                                   required>
                            <div class="help-block with-errors"></div>
                        </div>
                        <label class="col-sm-2 control-label" for="editcommission">提成:</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="editcommission" name="commission">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="editremark">备注:</label>
                        <div class="col-sm-8 col-md-pull-2">
                            <input type="text" class="form-control" id="editremark" name="remark">
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="submit" form="editForm" class="btn btn-primary"
                        data-action="{type:'submit',form:'#editForm',url:'@{/produce/update}',after:'$.myAction.refreshTable'}">
                    确定
                </button>
            </div>
        </div>
    </div>
</div>

<!-- delete modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="addModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="deleteSmallModalLabel">删除用户</h4>
            </div>
            <div class="modal-body">
                <form id="deleteForm"></form>
                确定要删除选中的 <span class="records"></span> 条记录?
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" form="deleteForm" class="btn btn-primary"
                        data-action="{type:'submit',form:'#deleteForm',url:'@{/produce/delete}',after:'$.myAction.refreshTable'}">
                    确定
                </button>
            </div>
        </div>
    </div>
</div>
<!-- import modeal -->
<div class="modal fade" id="importModal" tabindex="-1" role="dialog" aria-labelledby="addModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="importModalLabel">上传客户信息</h4>
            </div>
            <fieldset>
                <div class="modal-body">
                    <form id="importForm">
                        <input type="hidden" id="importpathfile" name="importpathfile"/>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="import"><span
                                    class="asterisk">*</span>上传文件:</label>
                            <div class="col-sm-10 controls">
                                <input type="file" multiple="multiple" id="import" name="import"
                                       data-show-caption="true"/>
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>
                    </form>
                    <div id="progressend" style="display: none">
                        <div id='modal_message' style="text-align: center"><h2>确定，开始导入.....</h2></div>
                        <div class="progress progress-striped active">
                            <div class="progress-bar progress-bar-success" id="prog" role="progressbar"
                                 aria-valuenow="60"
                                 aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
                            </div>
                            请等待导入完成
                        </div>
                    </div>
                </div>
            </fieldset>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="submit" form="addForm" class="btn btn-primary"
                        data-action="{type:'submit',form:'#importForm',url:'@{/produce/import}',after:'$.myAction.refreshTable'}">
                    确定
                </button>
            </div>
        </div>
    </div>
</div>

<!-- verify modal -->
<div class="modal fade" id="verifyModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="verifySmallModalLabel">审核业务清单</h4>
            </div>
            <div class="modal-body">
                <form id="verifyForm">
                    <div class="form-group">
                    <label for="verifystatus">审批</label>
                    <select class="form-control select2" id="verifystatus" name="status" style="width: 100%;" data-placeholder="审核状态" >
                        <option value="0" text="未审核">未审核</option>
                        <option value="1" text="无效">无效</option>
                        <option value="2" text="有效">有效</option>
                        <option value="3" text="已结算">已结算</option>
                    </select>
                </div>
                </form>
                确定要批量审批选中的 <span class="records"></span> 条记录?
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" form="verifyForm" class="btn btn-primary"
                        data-action="{type:'submit',form:'#verifyForm',url:'@{/produce/verify}',after:'$.myAction.refreshTable'}">
                    确定
                </button>
            </div>
        </div>
    </div>
</div>

<div id="actionButtons" class="admin-hide">
    <a class="like" href="javascript:void(0)" data-toggle="tooltip" title="Like"><i
            class="glyphicon glyphicon-heart"></i></a>　
    <a shiro:hasPermission="produce:update" class="edit ml10" href="javascript:void(0)" data-toggle="tooltip"
       title="编辑"><i class="glyphicon glyphicon-edit"></i></a>　
    <a shiro:hasPermission="produce:delete" class="remove ml10" href="javascript:void(0)" data-toggle="tooltip"
       title="删除"><i class="glyphicon glyphicon-remove"></i></a>　
</div>

<script th:inline="javascript">
    var $table = $('#table');

    $(function () {
        // bootstrap table初始化
        // http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/
        $table.bootstrapTable({
            url: CONTEXT_PATH + '/produce/list',
            cache: false,        //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            showExport: true,                     //是否显示导出
            exportDataType: "all",              //basic', 'all', 'selected'.
            exportTypes: ['excel', 'xlsx'],
            exportOptions: {
                ignoreColumn: [0, 1, 21]
            },
            idField: 'id',
            columns: [
                {field: 'state', checkbox: true},
                {field: 'id', title: '编号', sortable: true, halign: 'left'},
                {field: 'cdate', title: '日期', sortable: true, halign: 'left'},
                {field: 'handlerChannel', title: '渠道编号', sortable: true, halign: 'left'},
                {field: 'phone', title: '手机号码', sortable: true, halign: 'left'},
                {field: 'phoneSecond', title: '副卡号码', sortable: true, halign: 'left'},
                {field: 'bizType', title: '办理业务', sortable: true, halign: 'left'},
                {field: 'bizDetail', title: '业务明细', sortable: true, halign: 'left'},
                {field: 'specPri', title: '原规格产品', sortable: true, halign: 'left'},
                {field: 'specCur', title: '新规格产品', sortable: true, halign: 'left'},
                {field: 'handleNo', title: '办理工号', sortable: true, halign: 'left'},
                {field: 'handleType', title: '办理方式', sortable: true, halign: 'left'},
                {field: 'sumMoney', title: '金额', sortable: true, halign: 'left'},
                {field: 'handlerNo', title: '工号明细', sortable: true, halign: 'left'},
                {field: 'organizationName', title: '门店名称', sortable: true, halign: 'left'},
                {field: 'handleType', title: '办理方式', sortable: true, halign: 'left'},
                {field: 'batchNo', title: '批次号', sortable: true, halign: 'left'},
                {field: 'packageNo', title: '包编', sortable: true, halign: 'left'},
                {field: 'donateMonth', title: '月赠送金额', sortable: true, halign: 'left'},
                {field: 'organizationNo', title: '单元编码', sortable: true, halign: 'left'},
                {field: 'employer', title: '员工姓名', sortable: true, halign: 'left'},
                {field: 'rewardPiecework', title: '计件酬金', sortable: true, halign: 'left'},
                {field: 'score', title: '移动积分', sortable: true, halign: 'left'},
                {field: 'partsBalance', title: '销售差价', sortable: true, halign: 'left'},
                {field: 'commission', title: '提成', sortable: true, halign: 'left'},
                {field: 'verify', title: '状态', sortable: true, halign: 'left'},
                {field: 'remark', title: '备注', sortable: true, halign: 'left'},
                {
                    field: 'action',
                    title: '操作',
                    halign: 'center',
                    align: 'center',
                    formatter: 'actionFormatter',
                    events: 'actionEvents',
                    clickToSelect: false
                }
            ]
        });
        //Date picker
        $('#searchBeginDate,#searchEndDate,#datepicker,#editdatepicker').datepicker({
            autoclose: true,
            format: 'yyyy-mm-dd'
        }),
            /* //Date picker
             $('#searchEndDate').datepicker({
                 autoclose: true,
                 format: 'yyyy-mm-dd'
             }),
         //Date picker
         $('#datepicker').datepicker({
             autoclose: true,
             format: 'yyyy-mm-dd'
         }),
             //Date picker
             $('#editdatepicker').datepicker({
                 autoclose: true,
                 format: 'yyyy-mm-dd'
             }),*/
            <!--上传组件初始化-->
            initFileInput("import");
    });

    // 数据表格展开内容
    function detailFormatter(index, row) {
        var html = [];
        $.each(row, function (key, value) {
            html.push('<p><b>' + key + ':</b> ' + value + '</p>');
        });
        return html.join('');
    }

    function editAfter(obj, row) {
        <!--一个用户有几个角色，几个组-->
        /*        var roleIdList = row.roleIdList;
                var groupIdList = row.groupIdList;
                for (i in roleIdList) {
                    var roleId = roleIdList[i];
                    $('#editForm').find('[name=roleIds]').find('option[value=' + roleId + ']').prop('selected', true);
                }
                for(i in groupIdList) {
                    var groupId = groupIdList[i];
                    $('#editForm').find('[name=groupIds]').find('option[value=' + groupId + ']').prop('selected', true);
                }
                //初始化fileinput
                initFileInput("editheadImag");*/
    }

    function actionFormatter(value, row, index) {
        return $('#actionButtons').html();
    }

    window.actionEvents = {
        'click .like': function (e, value, row, index) {
            alert('You click like icon, row: ' + JSON.stringify(row));
            console.log(value, row, index);
        },
        'click .edit': function (e, value, row, index) {
            $('#editModal').modal('show')
            $('#editForm').fillForm(row);
            editAfter('', row);
            console.log(value, row, index);
        },
        'click .remove': function (e, value, row, index) {
            $('#deleteModal').modal('show');
            $('.records').html('1');
            var html = '';
            for (var key in row) {
                html += '<input type="hidden" name="' + key + '" value="' + row[key] + '">';
            }
            $('#deleteForm').html(html);
        }
    };

    <!--文件上传组件-->
    function initFileInput(ctrlName) {
        var control = $('#' + ctrlName);
        control.fileinput({
            language: 'zh', //设置语言
            uploadUrl: CONTEXT_PATH + '/fileserver/upload', //上传的地址
            allowedFileExtensions: ['xlsx', 'xls'],//接收的文件后缀
            uploadAsync: true, //默认异步上传
            showUpload: true, //是否显示上传按钮
            showRemove: true, //显示移除按钮
            showPreview: true, //是否显示预览
            showCaption: false,//是否显示标题
            browseClass: "btn btn-primary", //按钮样式
            maxFileCount: 1, //允许同时上传的最大文件个数
            enctype: 'multipart/form-data',
            validateInitialCount: true,
            msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",// "id": $('#headImag').val(),
            uploadExtraData: function (previewId, index) {           //传参
                var data = {
                    "previewId": previewId,      //此处自定义传参
                    "inputId": ctrlName,//上传input的id
                    "destDir": '/produce/import'
                };
                return data;
            }

        }).on('filepreupload', function (event, data, previewId, index) {     //上传中
            console.log('文件正在上传');
        }).on("fileuploaded", function (event, data, previewId, index) {    //一个文件上传成功
            var form = data.form, files = data.files, extra = data.extra,
                response = data.response, reader = data.reader;
            //console.log("上传文件保存路径="+response.tagPathFile);
            //console.log(response);//打印出返回的json
            //console.log(response.data.tagPathFile);//打印出路径
            $("#importpathfile").val(response.data.tagPathFile);
            $("#progressend").css('display', 'block');
            <!--后台执行进度提示-->
            monitor();
        }).on('fileerror', function (event, data, msg) {  //一个文件上传失败
            console.log('文件上传失败！' + data.status);
        })
    }


    function monitor() {
        var websocket = null;
        if ('WebSocket' in window) {
            websocket = new WebSocket('ws://localhost:8080/wximp/webSocket');
//            websocket = new WebSocket('ws://39.108.65.220:8086/wximp/webSocket');
        } else {
            alert('该浏览器不支持websocket!');
        }

        websocket.onopen = function (event) {
            console.log('建立连接');
        }

        websocket.onclose = function (event) {
            console.log('连接关闭');
        }

        websocket.onmessage = function (event) {
            //console.log('收到消息:' + event.data);
            var map = JSON.parse(event.data);
            //console.log(toString.call(map))
            var status = map.status;
            var total = map.total;
            var curr = map.curr;
            console.log("status：" + status + ",total:" + total + ",curr" + curr);
            var htmlText = "";
            htmlText += "<H2>";
            htmlText += status;
            htmlText += "<h4>(" + parseInt(curr) + "/" + parseInt(total) + ")</h4>";
            htmlText += "</H2>";
            $("#modal_message").html("<H2>开始导入数据</H2>");
            if (curr > 0) {
                $("#modal_message").html(htmlText);
            }
            $("#prog").css('width', 100 * parseInt(curr) / parseInt(total) + "%");
            //弹窗提醒, 播放音乐
            //$('#myModal').modal('show');

            // document.getElementById('notice').play();
        }

        websocket.onerror = function () {
            alert('websocket通信发生错误！');
        }

        window.onbeforeunload = function () {
            websocket.close();
        }
    };

    <!--自动填充-->
    $("#bizDetail").typeahead({
        source: function (query, process) {
            //query是输入的值
            $.ajax({
                url: "/wximp/common/dic/biztail",
                async: true,
                cache: false,
                type: "GET",
                dataType: "JSON",
                data: {name: query,type:'biz'},
                success: function (result) {
                    if (result.code == 200 && result.data) {
                        var array = [];
                        array = result.data;
                        //alert(JSON.stringify(array));
                        process(array);
                    }
                },
                autoSelect: true,
                display: 'name',
                minLength: 2,//键入字数多少开始补全
                showHintOnFocus: "true",//将显示所有匹配项
                fitToElement: true,//选项框宽度与输入框一致
                items: 'all',//下拉选项中出现条目的最大数量。也可以设置为“all”
                forceSerlection: true,////限定选择的值是列表中的 一个
                autoSelect: true,//允许你决定是否自动选择第一个建议
                delay: 500//在查找之间添加延迟
            })
        }
    });
    <!--自动填充-->
    $("#handlerNo").typeahead({
        source: function (query, process) {
            //query是输入的值
            $.ajax({
                url: "/wximp/jobno/autocomplete",
                async: true,
                cache: false,
                type: "GET",
                dataType: "JSON",
                data: {name: query},
                success: function (result) {
                    if (result.code == 200 && result.data) {
                        var array = [];
                        array = result.data;
                        //alert(JSON.stringify(array));
                        process(array);
                    }
                },
                autoSelect: true,
                display: 'name',
                minLength: 2,//键入字数多少开始补全
                showHintOnFocus: "true",//将显示所有匹配项
                fitToElement: true,//选项框宽度与输入框一致
                items: 'all',//下拉选项中出现条目的最大数量。也可以设置为“all”
                forceSerlection: true,////限定选择的值是列表中的 一个
                autoSelect: true,//允许你决定是否自动选择第一个建议
                delay: 500//在查找之间添加延迟
            })
        }
    });

</script>
</html>